<template>
	<view class="container">
		<view class="address-list">
			<view class="a-address" @click="goorder(item.id)" v-for="(item,index) in list" :key="index">
				<view class="left-text">
					<view class="address-box">
						<u-tag v-if="item.is_default == 1" bg-color="#016FDD" text="默认" size="mini"></u-tag>
						{{item.province_name}} {{item.city_name}} {{item.country_name}}
					</view>
					<view class="desc">
						<text> {{item.address}}</text>
						<img src="@/static/images/person/edit.jpg"
							@click.stop="go('/pages/person/addAddress?id='+item.id)">
					</view>
					<view class="name-tel">
						{{item.name}}
						<text>{{item.mobile}}</text>
					</view>

				</view>
			</view>
		</view>
		<!-- 底部操作按钮 -->
		<view class="footer">
			<u-button type="primary" shape="circle" color="linear-gradient(to right, #0096FF, #003DB1)"
				@click="go('/pages/person/addAddress')"> 新增收货地址
			</u-button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				addressList: [{
						id: 1,
						linkMan: '小明',
						mobile: '10086',
						address: '北京市西城区动物园'
					},
					{
						id: 2,
						linkMan: '小红',
						mobile: '10010',
						address: '北京市海淀区植物园',
						isDefault: true
					},
					{
						id: 3,
						linkMan: '小刚',
						mobile: '10001',
						address: '广东省广州长隆动物园'

					}
				],
				page: 1,
				total: 0,
				list: [],
				order_id: 0
			}
		},
		onLoad(e) {
			if (e.order_id) {
				this.order_id = e.order_id
			}

		},
		onShow() {
			this.getaddresslist()
		},
		methods: {
			goorder(e) {
				uni.redirectTo({
					url: '/pages/person/orderDetails?order_id=' + this.order_id + '&address_id=' + e
				})
			},
			getaddresslist() {
				var that = this
				that.$.ajax(1, 'POST', '/user/getaddresslist', {}, (res) => {
					if (this.page == 1) {
						this.list = []
					}
					that.list = [...res.data.list, ...that.list]
					that.total = res.data.total
				})
			},
			go(url) {
				uni.navigateTo({
					url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #FFF !important;
	}

	.container {


		.footer {
			position: fixed;
			bottom: 0;
			width: 100%;
			display: flex;

			padding: 20rpx;
			background-color: #fff;
			flex-direction: row-reverse;
			gap: 20rpx;
			//button {
			//    width: 200rpx;
			//    height: 72rpx;
			//}



		}
	}

	.address-list {
		width: 100%;
		padding: 0 30rpx;

	}




	.left-text {

		padding: 10rpx 0;
		border-bottom: 1rpx solid #F4F4F4;

	}



	.name-tel {
		font-size: 24rpx;
		font-weight: 400;
		color: #666666;


	}

	.address-box {
		display: flex;
		align-items: center;
		gap: 20rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: #666666;

	}

	.desc {
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 30rpx;
		font-weight: 700;
		margin: 20rpx 0;

		img {
			width: 30rpx;
			height: 30rpx;
		}
	}

	.bottom-box {
		position: fixed;
		width: 100%;
		bottom: 0;
		font-size: 28upx;
		color: #000000;
		border-top: 1upx solid #eee;
		height: 100upx;
		line-height: 100upx;
		background: #fff url() no-repeat 705upx center;
		background-size: 15upx auto;
	}

	.bottom-box .add-btn {
		margin-left: 30upx;
		padding-left: 70upx;
		background: url() no-repeat left center;
		background-size: 40upx auto;
	}
</style>